<template>
  <uni-nav-bar title="我的车队" left-icon="left" @clickLeft="navBack" :fixed="true" statusBar></uni-nav-bar>
  <view class="package column" style="padding:40rpx 20rpx;" v-if="!userInfo.getFleetAll.id">
    <view>您当前还没有车队，请前往创建车队</view>
    <view class="but" @click="navTo('fleet/fleet/addFleet')">创建车队</view>
  </view>
  <view class="package" v-if="userInfo.getFleetAll.id">
    <view class="space-between">
      <view>车队名称</view>
      <view>{{userInfo.getFleetAll.name}}</view>
    </view>
    <view class="space-between top">
      <view>管理员</view>
      <view>{{userInfo.getFleetAll.nickname}}</view>
    </view>
    <view class="space-between top">
      <view>手机号</view>
      <view @click="telCall(userInfo.getFleetAll.mobile)">{{userInfo.getFleetAll.mobile}}</view>
    </view>
    <view class="space-between top">
      <view>账户余额</view>
      <view>{{userInfo.getFleetAll.money}}元</view>
    </view>
    <view class="space-between top">
      <view>司机价</view>
      <view>{{userInfo.getFleetAll.price}}元/公斤</view>
    </view>
  </view>
  <view class="package center lis" v-if="userInfo.getFleetAll.id">
    <view v-for="item in list" :key="item.name" @click="navTo(item.path)"
      :style="{display:userInfo.getFleetAll.is_main!=1&&item.name=='邀请码'?'none':'block'}">{{item.name}}</view>
  </view>
</template>

<script setup lang="ts">
  import { telCall } from '@/utils/copyText';
  import { navBack, navTo } from '@/utils/navigator';
  import { onShow, onUnload } from '@dcloudio/uni-app';
  import { useUserStore } from '@/stores/user';
  const userInfo = useUserStore();
  const list = [{ name: '车队成员', path: 'fleet/fleet/memberList' },
  { name: '充值', path: 'fleet/money/recharge' },
  { name: '充值明细', path: 'fleet/money/recharOrder' },
  { name: '变动明细', path: 'fleet/fleet/details' },
  { name: '加注机', path: 'fleet/fleet/fillList' },
  { name: '邀请码', path: 'fleet/fleet/invite' }]
  onShow(() => {
    userInfo.fleetUser()
  })
  onUnload(() => {
    uni.removeStorageSync('getFleetAll');
  })
</script>

<style scoped lang="less">
  .but {
    width: 300rpx;
    height: 72rpx;
    background: #1B91FF;
    border-radius: 5px;
    text-align: center;
    line-height: 72rpx;
    color: #EAEFF3;
    margin-top: 80rpx;
  }

  .top {
    margin-top: 20rpx;
  }

  .lis {
    justify-content: space-between;
    flex-wrap: wrap;
    background-color: transparent;
    padding: 0px;

    view {
      width: 49%;
      background: #FFFFFF;
      border-radius: 5px;
      text-align: center;
      padding: 35rpx 0px;
      box-sizing: border-box;
      margin-bottom: 15rpx;
    }
  }
</style>